<template>
  <div class="action">
    <el-button class="cheaback" type="text" icon="el-icon-back" @click="hback"
      >返回</el-button
    >

    <el-tabs>
      <el-form ref="formdata" :model="formdata">
        <el-form-item label="作品标题" prop="title">
          <el-input :disabled="true" v-model="formdata.title"> </el-input>
        </el-form-item>
        <div class="active" >
          <img :src="formdata.images[0]" alt="" />
          <div v-html="formdata.text"></div>
        </div>
        <el-form-item>

          <template v-slot="{ row }">
        <el-button class="btn" @click="hsubmit(row)">通过</el-button>
        <el-button @click="hseltet(row)">拒绝</el-button>
      </template>
        </el-form-item>
      </el-form>
    
    
     
    </el-tabs>
  </div>
</template>

<script>
import { getdatalist,getdatadestet } from "@/api/roles";
export default {
  data() {
    return {
      list: [],
      formdata: {
        title: "",
        images: [""],
        text:''
      },
    };
  },
  created() {
    this.loacheckag();
  },
  methods: {
    loacheckag() {
      this.formdata = this.$route.query.row;
      this.list = this.formdata;
    },
    hback() {
      this.$router.back();
    },
    // 通过
  async hsubmit() {
    this.ress = this.list.articleId
      this.$confirm("你确定同意作品审核", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
      }).then(async () => {
    //  console.log(this.ress);
        const params = new URLSearchParams();
        params.append("articleId", this.ress);
        const res = await getdatalist(params);
          this.loacheckag();
          this.$router.push('/home/works/actioen')
        if (res.code !== 200) return this.$message.error(res.msg);
          this.$message.success(res.msg);

      })
    },
    // 拒绝
    hseltet(){
      this.resetn = this.list
      console.log(this.resetn.articleId);
   this.$confirm("请输入拒绝理由", "拒绝", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
      })
        .then(async () => {
          const param = new URLSearchParams();
          param.append("articleId", this.resetn.articleId);
          const res = await getdatadestet(param);
          this.loacheckag();
          if (res.code !== 200) return; this.$message.error(res.msg);

          this.$message.success(res.msg);
          this.$router.push('/home/works/actioen')
        })
  
    }
  },
};
</script>

<style scoped>
.action {
  background-color: #fff;
  padding: 30px;
}
.el-input {
  width: 30%;
  border: 1px solid #f9f9f9;
}

.active {
  border: 1px solid #eeeff1;
  width: 700px;
  height: 500px;
  margin-left: 50px;
  padding-left: 20px;
  overflow: scroll;
}
div {
  margin-bottom: 30px;
}
.btn {
  background-color: #ff7144;
  color: #fff;
}
img{
  width: 200px;
  height: 200px;
}
</style>
